import wrapRequest from '../../../utils/request'
const shareUtils = require('../../../utils/share')
Page({
	data: {
		visible: false,
		banner: "http://apiv1.frozenhu.cn/uploads/file/015f28b9df1bdd36427dd976fb73b29d_20240428151420.png",
		topItems: [
			// { imageSrc: 'http://apiv1.frozenhu.cn/uploads/file/35432301085851c649662cf9f4025195_20240430181023.png', title: '龙年大吉帘', desc: "本店回头第一", sale: "月售324", price: "￥17/次" },
			// { imageSrc: 'http://apiv1.frozenhu.cn/uploads/file/35432301085851c649662cf9f4025195_20240430181023.png', title: '龙年大吉帘', desc: "本店销售第一", sale: "月售324", price: "￥21/件" },
			// { imageSrc: 'http://apiv1.frozenhu.cn/uploads/file/35432301085851c649662cf9f4025195_20240430181023.png', title: '龙年大吉帘', desc: "本店回头第一", sale: "月售324", price: "￥17/次" },
			// { imageSrc: 'http://apiv1.frozenhu.cn/uploads/file/35432301085851c649662cf9f4025195_20240430181023.png', title: '龙年大吉帘', desc: "本店销售第一", sale: "月售324", price: "￥21/件" },
			// { imageSrc: 'http://apiv1.frozenhu.cn/uploads/file/35432301085851c649662cf9f4025195_20240430181023.png', title: '龙年大吉帘', desc: "本店回头第一", sale: "月售324", price: "￥17/次" },
			// { imageSrc: 'http://apiv1.frozenhu.cn/uploads/file/35432301085851c649662cf9f4025195_20240430181023.png', title: '龙年大吉帘', desc: "本店销售第一", sale: "月售324", price: "￥21/件" },
		],
		// sidebar 相关
		offsetTopList: [],
		sideBarIndex: 0,
		scrollTop: 0,
		categories: [
			// {
			// 	label: '春联1',
			// 	title: '巧夺豪门',
			// 	badgeProps: {},
			// 	items,
			// },
			// {
			// 	label: '门对',
			// 	title: '最新门对',
			// 	badgeProps: {
			// 		dot: true,
			// 	},
			// 	items: items.slice(0, 9),
			// },
		],
	},
	onVisibleChange(e) {
		this.setData({
			visible: e.detail.visible,
		});
	},
	setVisible() {
		this.setData({
			visible: true
		})
	},
	onCollect(e) {
		var that = this
		const productId = e.currentTarget.dataset.product_id
		const collect = e.currentTarget.dataset.collect
		const i1 = e.currentTarget.dataset.i1
		const i2 = e.currentTarget.dataset.i2
		console.log('res:', productId, collect, i1, i2)
		var categories = that.data.categories
		wrapRequest('/v1.0/huichun/mine/collect', 'POST', {
			data: {
				product_id: productId,
				collect: collect,
			},
			success: function (res) {
				categories[i1].items[i2].collect = collect
				that.setData({
					categories: categories,
				})
			}
		})
	},
	onCollectTop(e) {
		var that = this
		const productId = e.currentTarget.dataset.product_id
		const collect = e.currentTarget.dataset.collect
		const i1 = e.currentTarget.dataset.i1
		var topItems = that.data.topItems
		console.log('collect top:', productId, collect, i1, topItems)
		wrapRequest('/v1.0/huichun/mine/collect', 'POST', {
			data: {
				product_id: productId,
				collect: collect,
			},
			success: function (res) {
				topItems[i1].is_collect = collect
				that.setData({
					topItems: topItems,
				})
			}
		})
	},
	onLoad() {

		// 本店招牌
		this.getMarketSpecialty()
		// 列表
		this.getTabItems()
	},
	onSideBarChange(e) {
		const {
			value
		} = e.detail;
		this.setData({
			sideBarIndex: value,
			scrollTop: this.data.offsetTopList[value]
		});
	},
	onScroll(e) {
		const {
			scrollTop
		} = e.detail;
		const threshold = 50; // 下一个标题与顶部的距离

		if (scrollTop < threshold) {
			this.setData({
				sideBarIndex: 0
			});
			return;
		}

		const index = this.data.offsetTopList.findIndex((top) => top > scrollTop && top - scrollTop <= threshold);

		if (index > -1) {
			this.setData({
				sideBarIndex: index
			});
		}
	},

	// datas
	getMarketSpecialty() {
		var that = this
		wrapRequest('/v1.0/huichun/market/specialty', 'GET', {
			success: function (res) {
				let data = res.data.data
				data.map(item => {
					item.desc = item.desc.slice(0, 6)
					item.price = "￥" + item.price + "/件"
				})
				that.setData({
					topItems: res.data.data
				})
			},
			fail: function (e) {
				console.error('getMarketSpecialty fail:', e)
			}
		})
	},

	getTabItems() {
		var that = this
		wrapRequest('/v1.0/huichun/market/list', 'GET', {
			success: function (res) {
				let data = res.data.data.items
				console.log(data)
				let categories = []
				data.map(item => {
					let items = []
					item.products.map(i => {
						items.push({
							id: i.id,
							title: i.name.slice(0, 8),
							tags: i.tags,
							price: "￥" + i.price,
							collect: i.is_collect,
							image: i.pic,
						})
					})
					let category = {
						label: item.spu,
						items: items
					}
					categories.push(category)
				})
				that.setData({
					categories: categories
				})
				const query = wx.createSelectorQuery().in(that);
				const {
					sideBarIndex
				} = that.data;
				query.selectAll('.title').boundingClientRect();
				query.exec((res) => {
					const [rects] = res;
					const offsetTopList = rects.map((item) => item.top - 516); // 516 是debug出来,距离顶部的距离
					console.log("onload offsetTopList:", offsetTopList)
					that.setData({
						scrollTop: offsetTopList[sideBarIndex],
						offsetTopList: offsetTopList
					});
				});
			},
			fail: function (e) {
				console.error('getMarketSpecialty fail:', e)
			}
		})
	},
	/**
	 * 用户点击右上角分享
	 */
	onShareAppMessage() {
		return shareUtils.getShareConfig();
	},
	onShareTimeline() {
		return shareUtils.getShareConfig();
	}
})